This tutorial file was written with respect to an image texture 225 pixels wide by 225 pixels high. "Who cares"? Well, mapping coordinates are measured from 0 to 1. In the case of our texture, this means 0 is 0 and 1 is 225 divided by 225. Any point in between needs to be divided by 225 for this texture. If we had a texture that was, say 128 by 320, then everything on the S (width) axis is divided by 128 and everything in the T (height) axis would be divided by 320. This ensures your highest value is less than, or equal to 1 and your lowest value is greater than or equal to 0.
"So how do you figure out the points on your image"? I bring the texture into a paint program that shows the X and Y coordinates of my mouse pointer on the image. I locate the points I want. Remember, the X and Y coordinates correspond to the S and T coordinates respectively. I divide my X value at my point by the total width of the texture. If the X value at this point is 75, then S = 75/225 = 0.3333 and if the Y value is 225, then T = 225/225 = 1. VERY IMPORTANT: T is measured from the low to high. Some paint programs measure Y form high to low. This is not a problem. Just use the program's flip tool to flip the image vertically so it is upside-down. Then you are all set.
"Do I have to write these coordinates in any order"? YES! Just as your face set coordinate points for your faces are in order starting with zero, moving counter-clockwise, your texture coordinate points need to be zero to N in counter-clockwise order with each point corresponding to a point in face set coordinate points, as you see in the following source code.
#VRML V2.0 utf8
#texture mapping made less painful
Transform {
children [
Shape {
appearance Appearance {
texture ImageTexture {
url [ "stop.jpg" ]
}
}
geometry IndexedFaceSet {
coord Coordinate {
point [
-0.5 1.5 0,
-1.5 0.5 0,
-1.5 -0.5 0,
-0.5 -1.5 0,
0.5 -1.5 0,
1.5 -0.5 0,
1.5 0.5 0,
0.5 1.5 0,
]
}
texCoord TextureCoordinate {
point [
0.3333 1,
0 0.6667,
0 0.3333,
0.3333 0,
0.6667 0,
1 0.3333,
1 0.6667,
0.6667 1,
]
}
coordIndex [ 0, 1, 2, 3, 4, 5, 6, 7, -1 ]
texCoordIndex [ 0, 1, 2, 3, 4, 5, 6, 7, -1 ]
}
}
]
}